<template>
	<view>
		<view>
			<u-notice-bar :text="text1"></u-notice-bar>
		</view>
		<view class="img" v-if="show">
			<image src="https://iflytts.oss-cn-qingdao.aliyuncs.com/wxapp/xze/4.png" mode="widthFix" style="width: 100%;height: 100%;"></image>
			<text style="margin-left: 110rpx;">没有历史记录</text>
		</view>
		<view class="title" v-for="(item,index) in list" :key='index' @click="copy(item.title)">
			<view class="cont">
				{{item.title}}
			</view>
			<view class="cent">
				{{item.time}}
			</view>
			<view class="footer" @tap.stop="delWriting(index)">
				<u-icon name="trash" size="18" color="#999999"></u-icon>
				<text class="text" style="font-size: 22rpx;">清除文本</text>
			</view>
		</view>

	</view>
</template>

<script>
	export default {
		data() {
			return {
				text1: '伪原创作品在本地最多保存20条,请及时使用 删除小程序会清空记录',
				list: '',
				show: true,
				compareResults: ''
			};
		},
		onLoad() {

		},
		onShow() {
			let that = this
			that.list = uni.getStorageSync('content')
			if (uni.getStorageSync('content')) {
				that.show = false
			}
		},
		methods: {
			copy(title) {
                 uni.navigateTo({
                 	url:'../saver/saver?creativeResults=' + title
                 })
				
			},
			delWriting(index) {
				let that = this
				console.log(index)
				uni.showModal({
					title: '提示',
					content: '确认删除',
					success: function(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							that.list.splice(index, 1)
							uni.setStorageSync('content', that.list);
							if (that.list.length == 0) {
								that.show = true
								uni.removeStorageSync('content');
							}
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		}
	}
</script>

<style lang="scss">
	page {
		background: #F5F5F5;
	}

	.result_comparison {
		margin-top: 31rpx;
		margin-bottom: 20rpx;
		width: 696rpx;
		background: #FFFFFF;
		border-radius: 18rpx;
		margin-left: 25rpx;
        .resule_tit{
			.title{
				width: 133rpx;
				height: 32rpx;
				font-size: 34rpx;
				font-family: PingFang SC;
				font-weight: bold;
				color: #5490FF;
				margin-left: 270rpx;
			}
		}
		.results_textarea {
			padding: 0 20rpx 20rpx 20rpx;
			margin-top: 60rpx;
		}
	}


	.creative_results {
		padding-bottom: 30rpx;
		margin-top: 20rpx;
		width: 696rpx;
		background: #FFFFFF;
		border-radius: 18rpx;
		box-sizing: border-box;
}
	.creative_results_btn {
		margin: auto;
		margin-top: 30rpx;
		width: 333rpx;
		height: 120rpx;
	}

	.img {
		height: 400rpx;
		width: 400rpx;
		margin-left: 175rpx;
		margin-top: 351rpx;
	}

	.title {
		margin-top: 30rpx;
		margin-left: 21.5rpx;
		width: 707rpx;
		height: 157rpx;
		background: #FFFFFF;
		border-radius: 12rpx;
		position: relative;

		.footer {
			display: flex;
			position: absolute;
			right: 20rpx;
			bottom: 30rpx;

			text {
				font-size: 10px;
				margin-top: 8rpx;
				margin-left: 10rpx;
				color: #999999;

			}
		}

		.cont {
			text-overflow: ellipsis;
			/* 溢出显示省略号 */
			overflow: hidden;
			/* 溢出隐藏 */
			white-space: nowrap;
			/* 强制不换行 */
			font-size: 30rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
			padding: 28rpx;
			// line-height: 36rpx;
		}

		.cent {
			margin-left: 26rpx;
			font-size: 25rpx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #333333;
		}
	}
</style>